<!--
 * @Author: wang_sheshe
 * @Date: 2021-08-23 10:35:27
 * @LastEditTime: 2021-08-25 18:59:00
 * @Description: 调度令详情页
-->
<template>
	<article class="bg_4dbfae">
		<Theader :title="title">
			<template slot="header_arrow">
				<van-icon size="25" name="arrow-left" @click="$pageBack"/>
			</template>
		</Theader>
        <div style="overflow-y: auto;height: calc(100% - 7rem);padding-bottom: 3rem; margin-top: 3rem;">
            <div>
                <van-collapse class="collapse" v-model="activeNames">
                    <van-collapse-item name="1">
                      <template slot="title">
                        <div class="col-title">
                            <van-image :src="icon.iconTitle" width="20" height="20"></van-image>
                            <span style="margin-left: 0.4rem;">操作任务票</span>
                        </div>
                      </template>
                        <div class="lable-list">
                            <van-field 
                                label="编号"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="预定操作时间"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <div>
                                <van-row class="defe-des">操作目的</van-row>
                                <div style="margin: 15px 0;border-radius: 5px;">
                                    <van-field class="textarea-content" disable v-model.trim="taskDetail.remark" rows="2" autosize type="textarea"
                                    />
                                </div>
                            </div>

                            <van-field 
                                label="拟票人"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="审核人"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="预发人"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="监护人"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="执行人"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                        </div>
                    </van-collapse-item>

                    <van-collapse-item name="2">
                        <template slot="title">
                            <div class="col-title">
                                <van-image :src="icon.iconTitle" width="20" height="20"></van-image>
                                <span style="margin-left: 0.4rem;">操作内容</span>
                            </div>
                        </template>
                        <div class="lable-list">
                            <van-field 
                                label="操作编号"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="操作类型"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="序号"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="操作单位"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="项号"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <div>
                                <van-row class="defe-des">操作内容</van-row>
                                <div style="margin: 15px 0;border-radius: 5px;">
                                    <van-field class="textarea-content"  v-model.trim="taskDetail.remark" rows="2" autosize type="textarea"
                                    placeholder="请输入外委人员信息"
                                    />
                                </div>
                            </div>
                            <van-field 
                                label="接受人"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                            <van-field 
                                label="接受时间"  
                                readonly 
                                :border="false"
                                v-model="taskDetail.substationName"
                            />
                        </div>
                    </van-collapse-item>
                </van-collapse>
            </div>
        </div>
	</article>
</template>
<script>
	import Theader from "../component/header"
	export default {
		name: "commandDetail",
		components:{
			Theader
		},
		data() {
			return {
                active: 0,
                title: "调度令详情",
                activeNames:["1"],
                taskDetail: {
                    substationName:"东善桥变",
                    voltageLevel:"500Kv",
                    patrolTypeName:"全面巡视",
                    cycleTime:"2月",
                    fristTime:"2021/07/07 18:30:00",
                    team:"变电运维一班",
                    tourWay:"人工巡视",
                    planTime:"2021/07/07 18:30:00",
                    nextTime:"2021/07/07 18:30:00",
                    require:"的撒啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊",
                    remark:"1.10kv中邦10号变电站:将10kv分段I170开关由冷备用改为运行（合换）2.10kv中邦10号变电站:将10kv分段I170开关由冷备用改为运行（合换）",
                },
                icon: {
                    iconTitle: require("../../../../assets/tour/icon-title.png"),
                    rfid: require("../../../../assets/tour/icon-rfid.png"),
                    scan:require('../../../../assets/tour/icon-scan.png'),
                    deleteRed:require('../../../../assets/tour/delet-red.png'),
                    
                },
                activeNames: ['1'],
                radio:1,
			}
		},
		computed: {

		},
		methods: {
            //rifid 
            rfidBtn() {

            },
            //扫描二维码
            scanBtn() {

            },
		},
		watch: {
			
		},
		mounted() {

		}
	}
</script>
<style scoped>
	article {
		display: flex;
		flex-direction: column;
		height: 100vh;
	}
	.bg_4dbfae{
		background: #F0F0F0 ;
    }

    .lable-list /deep/ .van-cell{
        padding: 10px 0;
    }
    .lable-list /deep/ .van-field__label{
        width: 7rem;
    }
    .lable-list /deep/ .van-field__control{
        text-align: right;
    }

    .label-ll /deep/ .van-field__label{
        width: 7rem;
    }
    .label-ll /deep/ .van-field__control{
        text-align: right;
    }
    
    .defe-des{
        color:#666;margin-top: 15px;
        font-size:0.8rem;
    }
    .textarea-content /deep/ .van-cell{
        padding: 10px 16px;
    }
    .textarea-content /deep/ .van-field__control{
        text-align: left;
    }
    .textarea-content{
        color:#333;
        font-size:0.875rem;
		border: 1px solid #E2E2E2;color:#999;
        padding-bottom: 1.5rem;
    }
    .textarea-content /deep/ .van-field__right-icon{
        position: absolute;
        bottom: -0.2rem;
        right: 0.5rem;
    }
    .imgSize{
        margin: 0 1rem;
    }
    .selRadio  /deep/ .van-cell__title{
        width: 80px;
        flex: inherit;
        color:#666;
    }
    .selRadio  /deep/ .van-cell__value{
        display: flex;
        justify-content:flex-end;
    }

    /deep/ .van-collapse-item{
        margin: 0.7rem;
        border-radius: 0.7rem;
    }
    /deep/ .van-cell--clickable{
        border-radius: 0.7rem 0.7rem 0 0;
    }
    /deep/ .van-collapse-item__content{
        border-radius: 0rem 0rem 0.7rem 0.7rem;
    }
    .col-title{
        display: flex;
        align-items: center;
    }
    .col-col{
        margin: 0 1rem;
        padding: 1rem 0;
    }
</style>
